<template>
    <div
        id="centerClientDetail"
        class="centerclientuserinfo centeractiondetail clearfloat">
        <!-- <a class="returnback" @click="goback()">
            <img :src="`${constant.imgUrl}design/caseback.png`" alt />
        </a> -->
        <!-- 用户信息 -->
        <!-- <div class="centerClientDetail-box"> -->
            <div class="info firstinfo">
                <div class="follow_status">
                    <span :class="{'normal': !showhome}">
                        <span class="label">当前阶段：</span>
                        {{ sysBookingStatus[prebookDetail.status] || '待定' }}
                    </span>
                    <span class="edits edits_new" @click="personedit" v-if="prebookDetail">
                        <img :src="`${constant.imgUrl}publicicon/icon_edit.png`" alt />
                        编辑资料
                    </span>
                </div>
                <div class="usremessage">
                    <img :src="userInfoCard.user_picture" alt />
                    <div class="person_mesage">
                        <p class="name">
                            {{ prebookDetail.name ?
                            prebookDetail.name : userInfoCard.nick_name ?
                            userInfoCard.nick_name : '游客' }}
                        </p>
                        <a class="label" :href="`tel:${userInfoCard.mobile_phone}`">
                            手机号：{{ userInfoCard.mobile_phone ?
                            userInfoCard.mobile_phone : '暂无手机号' }}
                        </a>
                        <p class="label">
                            性别：{{ userInfoCard.sex_name ?
                            userInfoCard.sex_name : '保密' }}
                        </p>
                        <!-- <p class="label">来源：{{prebook_source == ''?'暂无来源':prebook_source}}</p> -->
                    </div>
                    <div class="intention">
                        <div class="intention_sh">
                            25
                            <span>%</span>
                        </div>
                        <div class="intention_btom">意向度</div>
                    </div>
                </div>
                <!-- <div class="rooms_mesage cell_list_com cell_list_user" v-if="showhome"> -->
                <div class="rooms_mesage cell_list_com cell_list_user">
                    <div>
                        <div class="cell_label">首次来源：</div>
                        <div class="cell_val">
                            <span class="highlight_text">【{{ firstViewInfo.urlFrom || '暂无' }}】</span>
                        </div>
                    </div>
                    <div v-if="firstViewInfo.share_user_nick_name">
                        <div class="cell_label">分享者：</div>
                        <div class="cell_val">{{ firstViewInfo.share_user_nick_name || '暂无' }}</div>
                    </div>
                    <div>
                        <div class="cell_label">登录设备：</div>
                        <div class="cell_val">{{ firstViewInfo.deviceType || '暂无' }}</div>
                    </div>
                    <div>
                        <div class="cell_label">访问浏览器：</div>
                        <div class="cell_val">{{ firstViewInfo.brower || '暂无' }}</div>
                    </div>
                    <div>
                        <div class="cell_label">访问时间：</div>
                        <div class="cell_val" v-if="firstViewInfo&&firstViewInfo.view_time_last">
                            {{  (firstViewInfo.view_time_last * 1000) | formatTime }}
                        </div>
                        <div class="cell_val" v-else>
                            暂无
                        </div>
                    </div>
                    <div>
                        <div class="cell_label">访问地区：</div>
                        <div class="cell_val">{{ firstViewInfo.full_address || '暂无' }}</div>
                    </div>
                </div>
            </div>
            <!-- 装修信息 -->
            <div class="info customer" v-if="prebookDetail">
                <div class="customer_box">
                    <p class="customer_title">客户信息</p>
                    <div class="record_list cell_list_com cell_list_house">
                        <div>
                            <div class="cell_label">预约电话：</div>
                            <a class="cell_val" :href="`tel:${prebookDetail.mobile_phone}`">{{ prebookDetail.mobile_phone || '未知' }}</a>
                        </div>
                        <div>
                            <div class="cell_label">来&#12288;&#12288;源：</div>
                            <div class="cell_val">{{ prebookDetail.prebook_source || '未知' }}</div>
                        </div>
                        <div>
                            <div class="cell_label">地&#12288;&#12288;区：</div>
                            <div class="cell_val">{{ '待确认' }}</div>
                        </div>
                        <div>
                            <div class="cell_label">小&#12288;&#12288;区：</div>
                            <div class="cell_val">{{ prebookDetail.xiaoqu || '待确认' }}</div>
                        </div>
                        <div>
                            <div class="cell_label">详细地址：</div>
                            <div class="two_cell_val">{{ prebookDetail.address || '待确认' }}</div>
                        </div>
                        <div>
                            <div class="cell_label">户&#12288;&#12288;型：</div>
                            <div class="cell_val" v-if="prebookDetail.house_type=='1'">
                                {{ $util.isEmpty(prebookDetail.house_shi)?'待确认':(`${prebookDetail.house_shi}房${prebookDetail.house_ting}厅${prebookDetail.house_yang}阳台${prebookDetail.house_wei}卫${$util.isEmpty(prebookDetail.house_chu)?0:prebookDetail.house_chu}厨`)}}
                            </div>
                            <div class="cell_val" v-else>
                                {{prebookDetail.house_remark || '待确认'}}
                            </div>
                        </div>
                        <div>
                            <div class="cell_label">面&#12288;&#12288;积：</div>
                            <div class="cell_val">
                                {{
                                $util.isEmpty(prebookDetail.square)?'待确认': prebookDetail.square + '㎡'
                                }}
                            </div>
                        </div>
                        <div>
                            <div class="cell_label">预&#12288;&#12288;算：</div>
                            <div class="cell_val">{{ sysBudgetStatus[prebookDetail.budget_type] || '待确认' }}</div>
                        </div>
                        <!--<div>
                            <div class="cell_label">装修类型：</div>
                            <div class="cell_val">{{ sysRenovationStatus[prebookDetail.renovation_type] || '待确认' }}</div>
                        </div>-->
                        <div>
                            <div class="cell_label">更新时间：</div>
                            <div class="cell_val">
                                {{ (prebookDetail.edit_time!==0?
                                prebookDetail.edit_time*1000:prebookDetail.create_time*1000) | formatTime }}
                            </div>
                        </div>
                        <div>
                            <div class="cell_label">业主需求：</div>
                            <div class="cell_val">{{ prebookDetail.remark || '暂无' }}</div>
                        </div>
                        <!--<div>
                            <div class="cell_label">装修合同：</div>
                            <div class="cell_val"><img class="ht" :src="prebookDetail.contract_img" /></div>
                        </div>-->
                    </div>
                </div>
            </div>
            <!-- 跟进记录 -->
            <div class="info customer" v-if="prebookDetail">
                <div class="customer_box">
                    <p class="customer_title">客户跟进记录（{{ returnVisitList.total || 0 }}）</p>
                    <div class="record_list">
                        <div v-if="returnVisitList.data && returnVisitList.data.length > 0">
                            <ul>
                                <li class="record_wrap" v-for="(item,index) in returnVisitList.data" :key="index">
                                    <div class="record_top">
                                        <div class="record_type">{{ item.return_visit_remark }}</div>
                                    </div>
                                    <div class="record_bottom">
                                        <p>{{ item.return_visit_time * 1000 | formatTime }}</p>
                                    </div>
                                </li>
                            </ul>
                            <p class="look_more label" @click="skipfollow()" v-if="followstatus">
                                查看所有跟进记录
                                <img :src="`${constant.imgUrl}login/right.png`" />
                            </p>
                        </div>
                        <div class="module_empty_wrap" v-else>
                            <v-noContent pmt-text="您当前暂无跟进记录~" />
                            <div class="empty_btn_com">
                                <div class="main_btn_com" @click="skipfollow()">添加跟进</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 订单记录（仅材料商账号展示） -->
            <div class="info customer order_wrap" v-if="orderInfo && userInfo.role_id == 2">
                <div class="customer_box">
                    <p class="customer_title">订单记录</p>
                    <div class="customer_info_box">
                        <div class="customer_info_left">
                            <div>订单号：{{ orderInfo.order_sn }}</div>
                            <div class="sub_text_mpt">{{ orderInfo.order_time }}</div>
                        </div>
                        <div class="customer_info_right">{{ orderInfo.order_status }}</div>
                    </div>
                    <div class="order_list_wrap">
                        <div v-if="orderInfo.order_goods && orderInfo.order_goods.length > 0">
                            <ul class="order_list_wrap_ul" :class="{ 'openHei' : !isOrderShowMore }">
                                <li class="goods_item" v-for="(item,index) in orderInfo.order_goods" :key="index">
                                    <div class="goods_item_left">
                                        <img :src="item.goods_thumb" alt />
                                    </div>
                                    <div class="goods_item_right">
                                        <div class="goods_item_title ellipsis_two_line_com">
                                            <span class="shop_title_tag" :class="[ item.is_self == 1? 'self_tag' : 'merchant_tag']">{{ item.is_self == 1? '自营' : '代销' }}</span>
                                            <span>{{ item.goods_name }}</span>
                                        </div>
                                        <div>
                                            <span>销售价：</span>
                                            <span>￥{{ item.goods_price }}/{{ item.goods_unit || '片' }}</span>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <!-- 查看更多 -->
                            <div class="look_more_wrap" v-show="isOrderShowMore">
                                <div class="look_more_btn" @click.stop="viewOrderMoreFn">
                                    <span>展开所有({{ orderInfo.order_goods.length - 2 }})</span>
                                    <i class="iconfont iconxiajiang"></i>
                                </div>
                            </div>
                            <div class="customer_total" :class="{ 'customer_total_margin' : isOrderShowMore }">
                                <span>共{{orderInfo.order_goods.length}}款商品 合计：</span>
                                <span class="highlight_text">￥{{orderInfo.total_amount}}</span>
                            </div>
                            <!-- <p class="look_more label" @click="skipfollow()" v-if="orderInfo.order_goods.length > 0"> -->
                            <p class="look_more label" @click="skipOrder(orderInfo.order_id)">
                                查看所有订单记录
                                <img :src="`${contant.imgUrl}login/right.png`" />
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 预约记录 -->
            <div class="info customer">
                <div class="customer_box">
                    <p class="customer_title">
                        客户预约记录
                        <span v-if="showhome">({{ prebookList.total || 0 }})</span>
                    </p>
                    <div class="record_list">
                        <div v-if="prebookList.data && prebookList.data.length > 0">
                            <ul v-if="showhome">
                                <li class="record_wrap" v-for="(item,index) in prebookList.data" :key="index">
                                    <div class="record_top">
                                        <div class="record_type">{{ item.name }}</div>
                                    </div>
                                    <div class="record_bottom">
                                        <p>{{ item.create_time * 1000 | formatTime }}</p>
                                    </div>
                                </li>
                            </ul>
                            <div class="record_type no_text" v-if="!showhome">游客暂无预约记录</div>
                            <p class="look_more label" @click="skipapction()" v-if="showhome">
                                查看所有预约记录
                                <img :src="`${constant.imgUrl}login/right.png`" />
                            </p>
                        </div>
                        <div class="module_empty_wrap" v-else>
                            <v-noContent pmt-text="您当前暂无预约记录~" />
                            <div class="empty_btn_com">
                                <div class="main_btn_com" @click="rapidFissionBtn(1)">如何快速裂变</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 客户行为轨迹 -->
            <div class="info customer">
                <div class="customer_box">
                    <p class="customer_title">
                        客户行为轨迹
                        <span v-if="trajectory">({{ userAllTraceList.total || 0 }})</span>
                    </p>
                    <div class="record_list">
                        <ul v-if="trajectory">
                            <li class="record_wrap" v-for="(item,index) in userAllTraceList.data" :key="index">
                                <div class="record_top">
                                    <div class="record_type">{{ item.path_name }}</div>
                                </div>
                                <div class="record_bottom">
                                    <p>{{ item.view_time_last * 1000 | formatTime }}</p>
                                </div>
                            </li>
                        </ul>
                        <div class="record_type no_text" v-if="!trajectory">游客暂无行为轨迹记录</div>
                        <p class="look_more label" @click="skipallaction" v-if="trajectory">
                            查看所有行为轨迹
                            <img :src="`${constant.imgUrl}login/right.png`" />
                        </p>
                    </div>
                </div>
            </div>
            <!-- 分享裂变记录 -->
            <div class="info customer" :class="{'last_info' : !showhome}">
                <div class="customer_box">
                    <p class="customer_title">
                        分享裂变记录
                        <span v-if="showhome">({{ fissionList.total || 0 }})</span>
                    </p>
                    <div class="record_list">
                        <div v-if="fissionList.data && fissionList.data.length > 0">
                            <ul v-if="showhome">
                                <li class="record_wrap" v-for="(item,index) in fissionList.data" :key="index">
                                    <div class="record_top">
                                        <div class="record_type">{{ item.path_name }}</div>
                                    </div>
                                    <div class="record_bottom">
                                        <p>{{ item.view_time_last*1000 | formatTime }}</p>
                                    </div>
                                </li>
                            </ul>
                            <div class="record_type no_text" v-if="!showhome">游客暂无裂变记录</div>
                            <p class="look_more label" @click="skipfission" v-if="showhome">
                                查看所有裂变记录
                                <img :src="`${constant.imgUrl}login/right.png`" />
                            </p>
                        </div>
                        <div class="module_empty_wrap" v-else>
                            <v-noContent pmt-text="您当前暂无裂变记录~" />
                            <div class="empty_btn_com">
                                <div class="main_btn_com" @click="rapidFissionBtn(2)">如何快速裂变</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 客户需求分析 -->
            <div class="info customer" :class="{'last_info' : showhome}" v-if="showhome">
                <div class="customer_box">
                    <p class="customer_title">客户需求分析</p>
                    <p class="subheading label">关注点</p>
                    <div class="customergroup_btns">
                        <a v-for="(item,index) in custorm" :key="index">
                            {{ item.name }}
                            <span class="label">·{{ item.num }}</span>
                        </a>
                    </div>
                    <!-- <p class="subheading label">兴趣点</p>
                    <div class="customergroup_btns">
                        <a v-for="(item,index) in intering" :key="index">
                            {{ item.name }}
                            <span class="label">·{{ item.num }}</span>
                        </a>
                    </div> -->
                </div>
            </div>
            <div class="info customer conlink">
                <div class="customer_box">
                    <p class="customer_title">
                    联系客服
                    <span v-if="showhome">({{ serviceReturnVisitList.total || 0 }})</span>
                    </p>
                    <div class="record_list">
                        <div v-if="serviceReturnVisitList.total > 0">
                            <ul>
                                <li
                                    class="record_wrap"
                                    v-for="(item,index) in serviceReturnVisitList.data" :key="index">
                                    <div class="record_top">
                                    <div class="record_type" v-html="turn(item.return_visit_remark)"></div>
                                    </div>
                                    <div class="record_bottom">
										<div><span>	{{ item.return_visit_time }}</span></div>
											<div>
												<span v-if="item.user_type==1">	{{item.user_name }}</span>
												<span v-if="item.user_type==2">	{{item.admin_user_name}}</span>
											</div>
                                    </div>
                                </li>
                            </ul>
                            <p class="look_more label" @click="skiplinkcustomer">
                                    查看所有回访记录
                                    <img :src="`${constant.imgUrl}login/right.png`" />
                            </p>
                        </div>
                        <div class="module_empty_wrap" v-else>
                            <v-noContent pmt-text="暂无记录~" />
                            <div class="empty_btn_com">
                            <div
                                class="main_btn_com"
                                @click="skiplinkcustomer" v-if='prebook_id'>联系客服</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 客户来源 -->
            <!-- <div class="info customer last_customer">
                <div class="customer_box">
                    <p class="customer_title">客户来源</p>
                    <p class="customer_browselist label" v-if="lastforms">
                        {{prebookDetail.create_time*1000 |
                        formatTime}}
                    </p>
                    <p class="customer_browselist" v-if="lastforms">
                        <span>通过微信昵称{{sharename}}(上级推荐人：微信昵称{{parentname}}) 推荐的H5页面注册</span>
                    </p>
                    <div class="record_type no_text" v-if="!lastforms">该游客暂无来源信息</div>
                </div>
            </div>-->
            <footer>
                <v-userDetFooter :phone="userInfoCard.mobile_phone" />
            </footer>
            <!-- 弹窗 -->
            <v-CustomerDetGuide ref="customerDetGuide" :back-img="popupBakcImg" />
        <!-- </div> -->
    </div>
</template>

<script>
import { mapGetters, mapState } from 'vuex'
import UserDetFooter from '@/components/module/UserDetFooter'
import NoContent from '@/components/module/NoContent'
import CustomerDetGuide from '@/pages/components/customerDetGuide'
// import { formatTime } from '@/util/datatime'
import { getCustomerDet } from '@/api/behaviorTrack'
// image
// import rapidPrebookImg from '@/assets/image/center/rapid_prebook.png'
// import rapidFissionImg from '@/assets/image/center/rapid_fission.png'
import { allOptions } from '@/mixins'

export default {
	name: 'Centerclientdatail',
	components: {
		'v-userDetFooter': UserDetFooter,
		'v-noContent': NoContent,
		'v-CustomerDetGuide': CustomerDetGuide
	},
	mixins: [allOptions],
	// filters: {
	// 	formatTime(time) {
	// 		const date = new Date(time)
	// 		return formatTime(date, 'yyyy-MM-dd hh:mm')
	// 	}
	// },
	computed: {
		...mapGetters({ userInfo: 'getUser' })
	},
	data() {
		return {
			headtitle: '客户详情',
			prebook_id: '529',
			prebook_source: '',
			// backstatus: true,
			scrollTop: 0,
			owner_user_id: '',
			create_user_id: '',
			userChain: '',
			custorm: [{ name: '现代简约', num: 12 }, { name: '现代中式', num: 2 }, { name: '意式极简', num: 10 }, { name: '意式轻奢', num: 5 }, { name: '现代北欧', num: 3 }],
			intering: [{ name: '东鹏', num: 15 }, { name: '大自然', num: 8 }, { name: '中装速配', num: 12 }, { name: '立邦', num: 5 }, { name: '多乐士', num: 3 }],
			sharename: '暂无',
			parentname: '暂无',
			showhome: true,
			// 是否是游客
			isTourist: true,
			lastforms: true,
			trajectory: true,
			followstatus: true, // 跟进记录状态
			// ****************
			firstViewInfo: '',
			fissionList: '',
			orderInfo: '',
			prebookDetail: '',
			prebookList: '',
			returnVisitList: '',
			userAllTraceList: '',
			userInfoCard: '',
			serviceReturnVisitList: '',
			// mask
			popupBakcImg: '',
			constant: this.$constant,
			query: null,
			oneLoad: false
		}
	},
	onShow(e) {
		if (this.oneLoad) {
			this.getInfo()
		}
	},
	onLoad(val) {
		this.query = val
		console.log(this.query)
		this.owner_user_id = this.query.owner_user_id
		this.prebook_id = this.query.prebook_id
		this.mobile_phone = this.query.mobile_phone
		this.create_user_id = this.query.create_user_id
	},
	mounted() {
		this.getInfo()
		this.oneLoad = true
	},
	methods: {
		turn(data) {
			return data.replace(/(\r\n|\n|\r)/gm, '<br/>')
		},
		// handleScroll() {
		// 	const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
		// 	const scroll = scrollTop - this.scrollTop
		// 	this.scrollTop = scrollTop
		// 	if (scroll > 0) {
		// 		this.backstatus = false
		// 	} else {
		// 		this.backstatus = true
		// 	}
		// },
		// 获取客户信息
		getInfo() {
			const params = {}
			if (this.create_user_id) {
				params.create_user_id = this.create_user_id
			}
			if (this.prebook_id) {
				params.prebook_id = this.prebook_id
			}
			getCustomerDet(params).then(res => {
				if (res.status === 'success') {
					// eslint-disable-next-line prefer-destructuring
					const data = res.data
					this.firstViewInfo = data.firstViewInfo
					this.fissionList = data.fissionList
					this.prebookDetail = data.prebookDetail
					this.prebookList = data.prebookList
					this.returnVisitList = data.returnVisitList
					this.userAllTraceList = data.userAllTraceList
					this.userInfoCard = data.userInfoCard
					this.serviceReturnVisitList = data.serviceReturnVisitList

					if (data.orderInfo) {
						this.orderInfo = data.orderInfo.length > 0 ? data.orderInfo[0] : []
						if (this.orderInfo.order_goods.length > 2) {
							this.isOrderShowMore = true
						}
					}
					// 状态值
					this.trajectory = data.userAllTraceList.total > 0
					this.isTourist = data.userInfoCard.user_id === 0
				} else {
                    	uni.showToast({
						title: res.errors.message,
						icon: 'none'
					})
				}
			})
		},

		// 如何快速裂变
		rapidFissionBtn(type) {
			this.popupBakcImg = this.constant.imgUrl + (type === 1 ? `/center/rapid_prebook.png` : 'center/rapid_fission.png')
			this.$refs.customerDetGuide.showMask()
		},
		//  *********
		personedit() {
			uni.navigateTo({
				url: `/pages/order/subscribeOrderEdit?status=edit&prebook_id=${this.prebookDetail.prebook_id}`
			})
		},
		skipfollow() { // 到跟进记录
			const params = {
				owner_user_id: this.query.owner_user_id,
				mobile: this.$util.isEmpty(this.returnVisitList.data) ? '' : this.returnVisitList.data[0].mobile_phone,
				prebookDetail: this.$util.isEmpty(this.prebookDetail)
					? ''
					: JSON.stringify({
						...this.prebookDetail,
						user_picture: this.userInfoCard.user_picture
					}),
				prebook_id: this.prebookDetail.prebook_id,
				isEmpty: this.$util.isEmpty(this.returnVisitList.data) ? 1 : 0
			}
			uni.navigateTo({
				url: `/pages/prebook/followrecord${this.commonJS.queryData(params)}`
			})
		},
		skipOrder(order_id) {
			let query = {
				order_id: order_id,
				user_id: this.create_user_id
			}
			uni.navigateTo({
				url: `/pages/material/ordermanage/orderDetail${this.commonJS.queryData(query)}`
			})
		},
		skipallaction() {
			// 到客户行为轨迹详情
			if (this.userAllTraceList === '') {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			} else if (this.userAllTraceList.data.length !== 0) {
				const query = {
					owner_user_id: this.query.owner_user_id,
					stats_type: this.userAllTraceList.data[0].stats_type,
					for_user_id: this.userAllTraceList.data[0].create_user_id,
					end_time: this.userAllTraceList.data[0].view_time_last,
					create_user_id: this.userAllTraceList.data[0].create_user_id,
					tabIndex: 0
			    }
				uni.navigateTo({
					url: `/pages/order/centerActionDetail${this.commonJS.queryData(query)}`
				})
			} else {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			}
		},
		skipapction() {
			// 到客户预约记录
			if (this.prebookList === '') {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			} else if (this.prebookList.data.length !== 0) {
				const params = {
					owner_user_id: this.query.owner_user_id,
					create_user_id: this.query.create_user_id,
					mobile: this.prebookDetail.mobile_phone
				}
				uni.navigateTo({
					url: `/pages/prebook/appointrecord${this.commonJS.queryData(params)}`
				})
			} else {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			}
		},
		skiplinkcustomer() {
			const params = {
				prebook_id: this.prebookDetail.prebook_id,
				create_user_id: this.query.create_user_id,
				mobile: this.prebookDetail.mobile_phone
			}
			uni.navigateTo({
				url: `/pages/order/linkCustomer${this.commonJS.queryData(params)}`
			})
		},
		skipfission() {
			// 裂变数据详情
			if (this.fissionList === '') {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			} else if (this.fissionList.data.length === 0) {
				uni.showToast({
					title: '没有数据可查',
					icon: 'none'
				})
			} else {
				let query = {
					owner_user_id: this.query.owner_user_id,
					stats_type: this.fissionList.data[0].stats_type,
					for_user_id: this.fissionList.data[0].user_id,
					end_time: this.fissionList.data[0].view_time_last,
					create_user_id: this.fissionList.data[0].create_user_id,
					tabIndex: 1
				}
				uni.navigateTo({
					url: `/pages/order/centerActionDetail${this.commonJS.queryData(query)}`
				})
			}
		}
	}
}
</script>

<style scoped lang="scss">
.returnback img {
    width: 60px;
    height: 60px;
    float: left;
}
.centerclientuserinfo .info {
    margin-top: 20px;
    padding-left: 40px;
    background-color: #fff;
    box-sizing: border-box;
}
/*
预约单客户详情*/
.follow_status{
  height: 80px;
  font-size: 24px;
  line-height: 80px;
}
.centerclientuserinfo .label{
  color: #999999;
}
.edits{
  float: right;
  margin-right: 29px;
}
.edits img{
  float: left;
  width: 28px;
  height: 28px;
  margin-top: 25px;
  margin-right: 10px;
}
.usremessage{
  width: 96%;
  float: left;
  margin-right: 10px;
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 2px solid #cccccc;
}
.usremessage img{
  width: 120px;
  height: 120px;
  float: left;
  border-radius: 50%;
  margin-right: 10px;
}
.person_mesage{
  float: left;
  width: 54%;
  font-size: 24px;
  margin-left: 10px;
}
.person_mesage .name{
  font-size: 34px;
  margin-bottom: 15px;
  display: -webkit-box;
  word-break: break-all;
  -webkit-line-clamp: 1;
  /*! autoprefixer: off */
  -webkit-box-orient: vertical;
  /* autoprefixer: on */
  overflow: hidden;
  text-overflow: ellipsis;
}
.rooms_mesage{
  width: 100%;
  float: left;
  margin-top: 30px;
  margin-bottom: 20px;
}
.intention{
  float: right;
  width: 120px;
  height: 120px;
  text-align: center;
  line-height: 60px;
}
.intention_sh{
  width: 120px;
  height: 60px;
  font-size: 40px;
  color: #ff6900;
  background: #fff8dc;
  border-radius: 10px 10px 0 0;
}
.intention_sh span{
  font-size: 24px;
}
.intention_btom{
  width: 120px;
  height: 60px;
  color: #3a1b04;
  background: #ffd11a;
  border-radius: 0 0 10px 10px;
}
.rooms_left{
  float: left;
  width: 50%;
  line-height: 40px;
}
.rooms_right{
  float: left;
  width: 50%;
  line-height: 40px;
}
.customer{
  margin-top: 20px;
}
.customer_box{
  width: 90%;
  float: left;
  margin-left: 40px;
}
.subheading{
  margin-top: 20px;
  margin-bottom: 5px;
  font-size: 24px;
  font-weight: bold;
 /* margin-bottom: 20px;*/
}
/*.customer_box ul{
  width: 100%;
  height: 60px;
  padding-bottom: 20px;
  border-bottom: 1px solid #cccccc;
}*/
.customer_box .customer_inter{
  border: none;
}
.data_list{
  margin-top: 20px;
}
/*.customer_box ul li{
  width: 20%;
  float: left;
  text-align: center;
}*/
.customergroup_btns{
  width: 100%;
  height: auto;
  float: left;
  margin-bottom: 50px;
}
.customergroup_btns a{
  height: 60px;
  line-height: 60px;
  padding: 0 18px;
  text-align: center;
  border-radius: 30px;
  background: #f3f4f8;
  float: left;
  margin-left: 20px;
  font-size: 24px;
}
.customergroup_btns a{
  margin-top: 15px;
}
.customergroup_btns a:nth-child(3n+1){
  margin-left: 0;
}
.customer_title{
  margin-top: 30px;
  font-size:30px;
  margin-bottom:30px;
  font-weight: bold;
}
.last_customer{
  margin-bottom: 150px;
}
.customer_browselist{
  display: -webkit-box;
  word-break: break-all;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 24px;
  margin-bottom: 20px;
  /*! autoprefixer: off */
  -webkit-box-orient: vertical;
  /* autoprefixer: on */
}
.customer_browselist span{
  font-size: 30px;
  line-height: 48px;
}
.look_more{
  clear: both;
  font-size: 24px;
  padding: 40px;
  text-align: center;
  position: relative;
}
.look_more img{
  float: right;
  width: 15px;
  height: 28px;
  position: relative;
  right: 23%;
  top: 6px;
}
.linkways{
  float: right;
  margin-top: 15px;
  margin-right: 20px;
}
.linkbtns{
  width: 160px;
  height: 70px;
  float: left;
  line-height: 70px;
  background: #ffffff;
  border:1px solid #666666; /*no*/
  border-radius: 35px;
}
.linkbtns i{
  float: left;
  width: 42px;
  height: 42px;
  margin:15px 10px 0 25px;
}
.linkbtns .info_func_tip{
  line-height: 70px;
  float: left;
}
.centerclientuserinfo .icon_info_wechat{
  background-image: url($imgUrl + 'design/weichat.png');
}
#centerClientDetail {
    height: 100%;
    background: none;
    padding-bottom: 120px;
    // display: inline-block;
    background-color: #f5f5f5;
    line-height: 1.4;
    ov
    .look_more {
        padding: 40px 40px 0 40px;
    }
    .module_empty_wrap {
        .empty_btn_com {
            display: flex;
            justify-content: center;
            margin-top: 20px;
        }
    }
    .cell_list_com {
        width: 100%;
        color: $fontColor2;
        & > div {
            width: 100%;
            display: flex;
            align-items: center;
            margin-bottom: 12px;
        }
        .cell_label {
            width: 160px;
            text-align: right;
            color: $fontColor3;
            margin-right: 10px;
            flex-shrink: 0;
        }
        .cell_val {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            padding-right: 20px;
        }
        .two_cell_val {
            text-overflow: -o-ellipsis-lastline;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            -webkit-box-orient: vertical;
            padding-right: 20px;
        }
        .highlight_text {
            color: #2965fe;
        }
    }
    .cell_list_house {
        font-size: 30px;
        margin-left: 0;
        & > div {
            font-size:24px;
        }
    }
    // 订单列表
    .order_wrap {
        // 头部
        .customer_info_box {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            font-size: 24px;
            .customer_info_left {
                color: $fontColor2;
                .sub_text_mpt {
                    color: $fontColor3;
                    font-size: 24px;
                    margin-top: 10px;
                }
            }
            .customer_info_right {
                color: #ff6900;
            }
        }
        .order_list_wrap {
            margin: 30px 0;
            position: relative;
            .goods_item {
                display: flex;
                align-items: center;
                margin-bottom: 40px;
                .goods_item_left {
                    width: 140px;
                    height: 140px;
                    border-radius: 10px;
                    border: 1px solid $borderColorMain; /*no*/
                    margin-right: 20px;
                    flex-shrink: 0;
                    img {
                        width: 100%;
						height: 140px;
                        border-radius: 10px;
                    }
                }
                .goods_item_title {
                    font-size: 30px;
                    margin-bottom: 36px;
                    color: #333;
                    min-height: 80px;
                    .shop_title_tag {
                        font-size: 24px;
                        font-weight: 400;
                        padding: 0 6px;
                    }
                    .shop_title_tag.self_tag {
                        color: #ff6900;
                        background-color: #fff5ef;
                    }
                    .shop_title_tag.merchant_tag {
                        color: #2965fe;
                        background-color: #f3f3fe;
						padding: 0;
                    }
                }
            }
            .goods_item:last-child {
                margin-bottom: 0;
            }
            .customer_total {
                color: $fontColor2;
                font-size: 24px;
                text-align: right;
                margin-top: 40px;
                .highlight_text {
                    color: #e43c36;
                }
            }
            .customer_total_margin {
                margin-top: 90px;
            }
            .order_list_wrap_ul {
                max-height: 340px;
                overflow: hidden;
            }
            .look_more_wrap {
                position: absolute;
                // bottom: -84px;
                top: 300px;
                width: 100%;
                text-align: center;
                margin-bottom: 30px;
                height: 90px;
                background-image: linear-gradient(-180deg, rgba(255, 255, 255, 0) 0%, #fff 44%);
                .look_more_btn {
                    width: 236px;
                    height: 50px;
                    line-height: 50px;
                    margin: 50px auto 0;
                    color: $fontColor2;
                    border-radius: 50px;
                    background-color: #f5f5f5;
                    opacity: 1;
                    i {
                        font-size: 24px;
                        color: $fontColor3;
                    }
                }
            }
        }
    }
    //
    .ht{
        width:100px;
        height: 100px;
    }
    .record_list {
        margin-top: 40px;
        margin-bottom: 40px;
        ul {
            border-left: 2px solid #ccc;
        }
        .record_wrap {
            padding-left: 30px;
            margin-bottom: 50px;
            .record_top {
                position: relative;
                top: -10px;
                display: flex;
                align-items: center;
                color: #666;
                .record_type {
                    font-size: 24px;
                    text-align: justify;
                    word-break: break-all;
                }
                & > div {
                    margin-right: 20px;
                }
            }
            .record_top::before {
                position: absolute;
                left: -42px;
                content: '';
                display: inline-block;
                width: 16px;
                height: 16px;
                border: 4px solid #fff;
                border-radius: 50%;
                background-color: #ccc;
            }
            .record_bottom {
				margin-right: 20px;
                /*background-color: #f5f5f5;*/
                border-radius: 16px;
                display: flex;
                font-size: 24px;
                color: #999999;
                align-items: center;
				justify-content: space-between;
                .record_img {
                    width: 168px;
                    height: 130px;
                    margin-right: 20px;
                    img {
                        width: 100%;
                        height: 100%;
                        border-top-left-radius: 16px;
                        border-bottom-left-radius: 16px;
                    }
                }
                .attr_img {
                    width: 130px;
                }
                .record_bottom_main {
                    color: #333;
                    font-size: 30px;
                    margin-bottom: 10px;
                }
            }
        }
        .record_wrap:nth-child(1) {
            .record_type {
                color: #ff6900;
            }
            .record_top::before {
                background-color: #ff9600;
            }
        }
    }

    .edits_new {
        position: fixed;
        right: 0;
        z-index: 99;
    }
}

.centerclientuserinfo .record_list {
    padding: 0;
    margin-left: 20px;
}

.firstinfo {
    margin-top: 0 !important;
}

.centerclientuserinfo .info {
    width: 100%;
    float: left;
}

.customer {
    padding-left: 0 !important;
}

.returnback {
    margin-top: 10px;
    width: 40px;
    height: 40px;
}

.linkbtns {
    width: 160px;
    height: 70px;
    float: left;
    line-height: 70px;
    background: #ffffff;
    border: 1px solid #666666;
    border-radius: 35px;
}

.linkbtns i {
    float: left;
    width: 42px;
    height: 42px;
    margin: 15px 10px 0 25px;
}

.linkbtns .info_func_tip {
    line-height: 70px;
    float: left;
}

.normal {
    color: #cccccc;
}

.no_text {
    margin-bottom: 20px;
    margin-left: -18px;
}
.fastcreat {
    float: right;
    width: 200px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    background: #fed037;
    border-radius: 15px;
    margin-right: 20px;
    margin-top: 15px;
}
.conlink{
    padding-bottom: 90px;
}
</style>
